import tinymce from 'tinymce/tinymce'
import { editable, getPageSheetNode } from '@/utils/helpers'
import { spanTypes } from '@/constants/structure'

function getParagraphNode(editor) {
  const node = editor.selection.getNode()
  if (node?.dataset?.type === 'paragraph') {
    return node
  }
  // 如果当前是行内元素,判断它的父元素是否是段落
  if (spanTypes.includes(node?.dataset?.type) && node?.parentNode?.dataset?.type === 'paragraph') {
    return node.parentNode
  }
  return null
}

tinymce.PluginManager.add('paraLang', function (editor) {
  const entries = {
    中文: 'zh',
    英文: 'en'
  }
  const arr = Object.keys(entries).map((item) => {
    return {
      type: 'togglemenuitem',
      text: item,
      onAction: () => {
        getParagraphNode(editor).dataset.lang = entries[item]
        editor.undoManager.add()
      },
      onSetup: function (e) {
        const node = getParagraphNode(editor)
        // 仅段落设置语言
        if (node) {
          // 判断当前语言
          e.setActive((node.dataset.lang || 'zh') === entries[item])
        } else {
          e.setDisabled(true)
        }
      }
    }
  })
  editor.ui.registry.addIcon('paraLangIcon', '<svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g transform="translate(-789.000000, -161.000000)" fill="#000000" fill-rule="nonzero"> <g transform="translate(16.000000, 149.500000)"> <g transform="translate(190.000000, 8.000000)"> <g transform="translate(583.000000, 3.500000)"> <rect opacity="0" x="0" y="0.5" width="24" height="24"></rect> <path d="M21.4899974,19.3125 L2.50980653,19.3125 C2.36680509,19.3125 2.24980391,19.396875 2.24980391,19.5 L2.24980391,20.8125 C2.24980391,20.915625 2.36680509,21 2.50980653,21 L21.4899974,21 C21.6329988,21 21.75,20.915625 21.75,20.8125 L21.75,19.5 C21.75,19.396875 21.6329988,19.3125 21.4899974,19.3125 Z M21.6298626,6 L12.8598355,6 C12.7937599,6 12.7396981,6.084375 12.7396981,6.1875 L12.7396981,7.5 C12.7396981,7.603125 12.7937599,7.6875 12.8598355,7.6875 L21.6298626,7.6875 C21.6959382,7.6875 21.75,7.603125 21.75,7.5 L21.75,6.1875 C21.75,6.084375 21.6959382,6 21.6298626,6 Z M21.4899974,14.875 L2.50980653,14.875 C2.36680509,14.875 2.24980391,14.959375 2.24980391,15.0625 L2.24980391,16.375 C2.24980391,16.478125 2.36680509,16.5625 2.50980653,16.5625 L21.4899974,16.5625 C21.6329988,16.5625 21.75,16.478125 21.75,16.375 L21.75,15.0625 C21.75,14.959375 21.6329988,14.875 21.4899974,14.875 Z M21.6298626,10.4375 L12.8598355,10.4375 C12.7937599,10.4375 12.7396981,10.521875 12.7396981,10.625 L12.7396981,11.9375 C12.7396981,12.040625 12.7937599,12.125 12.8598355,12.125 L21.6298626,12.125 C21.6959382,12.125 21.75,12.040625 21.75,11.9375 L21.75,10.625 C21.75,10.521875 21.6959382,10.4375 21.6298626,10.4375 Z"></path> <path d="M3.43782159,12.8639318 L4.66378313,12.8639318 C4.72436005,12.8639318 4.77916774,12.8249895 4.79791774,12.7658549 L5.57243697,10.3716241 L8.73397544,10.3716241 L9.50128313,12.7658549 C9.52003313,12.8235472 9.57339851,12.8639318 9.63541774,12.8639318 L10.9205139,12.8639318 C10.9363793,12.8639318 10.9522447,12.8610472 10.9666677,12.8567202 C11.0402254,12.8307587 11.0791677,12.7514318 11.0532062,12.6778741 L8.0517639,3.95912409 C8.03157159,3.90287409 7.9782062,3.86393178 7.91907159,3.86393178 L6.44359082,3.86393178 C6.3830139,3.86393178 6.32964851,3.90143178 6.31089851,3.95912409 L3.30512928,12.6778741 C3.29936005,12.6922972 3.29789363,12.7081625 3.29789363,12.7240279 C3.29647544,12.8004702 3.35993697,12.8639318 3.43782159,12.8639318 L3.43782159,12.8639318 Z M7.12868697,5.42018178 L7.18782159,5.42018178 L8.39647544,9.22498947 L5.90705236,9.22498947 L7.12868697,5.42018178 L7.12868697,5.42018178 Z"></path></g></g></g></g></g></svg>' );
  // 工具栏按钮
  editor.ui.registry.addMenuButton('paraLang', {
    tooltip: '段落',
    icon: 'paraLangIcon',
    fetch: (cb) => cb(arr)
  })

  // 右键 - 中文
  editor.ui.registry.addToggleMenuItem('paraLangZh', {
    text: '中文',
    onSetup: function (api) {
      api.setActive(getParagraphNode(editor).dataset.lang !== 'en')
      return function () {}
    },
    onAction() {
      getParagraphNode(editor).dataset.lang = 'zh'
      editor.undoManager.add()
    }
  })

  // 右键 - 英文
  editor.ui.registry.addToggleMenuItem('paraLangEn', {
    text: '英文',
    onSetup: function (api) {
      api.setActive(getParagraphNode(editor).dataset.lang === 'en')
      return function () {}
    },
    onAction() {
      getParagraphNode(editor).dataset.lang = 'en'
      editor.undoManager.add()
    }
  })

  // 右键菜单
  editor.ui.registry.addContextMenu('paraLang', {
    update() {
      const node = getParagraphNode(editor)
      const dataset = getPageSheetNode(editor)?.dataset
      if (!dataset) return []
      const pageType = dataset?.contentPageType || dataset?.pageType
      // 除：封面，签署，修改记录，封面，引用文件，索引
      if (['cover', 'signature', 'revision', 'contents', 'index', 'indexEn', 'normative_references'].includes(pageType) || !editable(dataset)) {
        return []
      }
      return node?.dataset?.type === 'paragraph' && !node?.dataset?.blockType ? ['paraLangZh', 'paraLangEn'] : []
    }
  })

  return {
    getMetadata: function () {
      return {
        name: '段落',
        url: 'http://sfrj.cn'
      }
    }
  }
})
